<template>
	<div class="orderpay">
		<ordernav :msg="1"></ordernav>
		<div id="kong">
			<img class="kong-img" src="../../img-shopping/kong@2x.png"/>
			<p class="kong-p">这里没有任何商品呢</p>
			<div @click="zhuye()" class="kong-b"><span class="kong-btn">去首页</span></div>
		</div>
		<div class="shopcard-listBox" v-for="item in orderlist">
			<h3 class="shopcard-title"><i><img src="../../img-shopping/icon_dianpu@3x.png"/></i><span>{{item.seller_name}}</span>
				<span v-if="item.status==11" class="order-goods-stute">等待买家付款</span>
				<span v-if="item.status==0" class="order-goods-stute">订单已取消</span>
				<span class="order-goods-stute" v-if="item.status==20">待发货</span>
				<span class="order-goods-stute" v-if="item.status==30">待收货</span>
				<span class="order-goods-stute" v-if="item.status==40">已完成订单</span>
			</h3>
			<ul class="shopcard-list-item-box">
				<li class="shopcard-list-item" v-for="itemlist in item.order_goods">
					<div>
						<router-link :to="{path:'orderxq',query:{'orderid':itemlist.order_id}}">
							<img :src="'http://www.ntyouxuan.com/'+itemlist.goods_image"/>
							<div class="shopcard-list-item-xinxi">
								<h3>{{itemlist.goods_name}}</h3>
								<p><span>{{itemlist.specification}}</span><span class="order-tkzt" v-if="itemlist.refund_status&&!(itemlist.refund_status=='SUCCESS')&&!(itemlist.refund_status=='CLOSED')">退款中</span><span class="order-tkzt" v-if="itemlist.refund_status&&itemlist.refund_status=='SUCCESS'">退款成功</span><span class="order-tkzt" v-if="itemlist.refund_status&&itemlist.refund_status=='CLOSED'">退款关闭</span></p>
								<div class="shopcard-item-num">
									<span>￥</span>
									<span>{{itemlist.price_detail[0]}}.</span>
									<span>{{itemlist.price_detail[1]}}</span>
									<p class="shopDd-itemnum">x{{itemlist.quantity}}</p>
								</div>
							</div>
						</router-link>
					</div>
					
				</li>	
			</ul>
			<div class="shopDd-ddh"><span>订单编号：{{item.order_sn}}</span><span>￥{{item.order_amount}}</span><span>合计</span></div>
			<div class="shopDd-list-czbtn">
				<!--<router-link class="order-dpj" to="/myorder/orderpj" v-if="item.status==40">评价</router-link>-->
				<a class="order-qrsh" v-if="item.status==30">确认收货</a>
				<a class="order-qxdd" v-if="item.status==11"  @click="orderqxd(item.status,item.order_id,item.order_sn)">取消订单</a>
				<router-link class="order-ckdd" :to="{path:'/myorder/orderxq',query:{'orderid':item.order_id}}">查看订单</router-link>
				<router-link :to="{path:'/payrequet',query:{'ordertoken':item.order_id,'token':user}}" class="order-qfk" v-if="item.status==11&&!item.ad_status">去付款</router-link>
				<router-link :to="{path:'/payrequet',query:{'ordertoken':item.order_id,'token':user}}" class="order-qfk" v-if="item.ad_status==3">付定金</router-link>
				<router-link :to="{path:'/payrequet',query:{'ordertoken':item.order_id,'token':user}}" class="order-qfk" v-if="item.ad_status==2">付尾款</router-link>
				<span class="order-qfk" v-if="item.ad_status==1">等待付尾款</span>
			</div>
		</div>
		<orderqxdd :msg="listtext" :biannum="qxddbianh" @senddata="senddt"  v-if="qxddshow" @qxsend="qxpush"></orderqxdd>
	</div>
</template>

<script>
	import ordernav from '@/components/order-group/Ddnav'
	import orderqxdd from '@/components/order-group/orderqxdd'
	
	var furl = 'http://www.ntyouxuan.com/';
	export default{
		name:'orderpay',
		data () {
			return{
				user:0,
				status:11,
				orderpage:1,
				orderlist:[],
				listtext:[
					'我不想买了',
					'信息填写错误，重新拍',
					'卖家缺货',
					'同城见面交易',
					'其他原因'
				],
				orderid:0,
				qxddshow:false,
				qxddbianh:0,
				scrollstatu:true,
				pagenum:0
			}
		},
		components:{ordernav,orderqxdd},
		created:function(){
			this.user=localStorage.getItem("nt_user");
			var self=this;
			this.ajaxorder();
		},
		methods:{
			ajaxorder:function(){
				var self=this;
				$.ajax({
					type:"get",
					url:furl+"index.php?app=ajax_buyer_order&act=index",
					data:{'token':self.user,'status':self.status,'page':self.orderpage},
					dataType:'json',
					success:function(res){
						self.orderlist=self.orderlist.concat(res.retval.orders);
						self.pagenum=res.retval.page_info.page_count;
						self.scrollstatu=true;
						self.orderfax=res.retval.page_info.item_count;
						if(self.orderfax != 0){
							$("#kong").css("display","none")
							
						}
					}
				});
			},
			zhuye: function() {
				window.location.href = 'http://www.ntyouxuan.com/newnt/#/';
			},
			orderqxd:function(num,id,bianh){
				if(num==11){
					this.orderid=id;
					this.qxddbianh=bianh;
					this.qxddshow=true;
				}
			},
			senddt:function(data){
				var self=this;
				$.ajax({
					type:"post",
					url:furl+"index.php?app=ajax_buyer_order&act=cancel_order",
					data:{'token':self.user,'order_id':self.orderid,'remark':self.listtext[data]},
					dataType:'json',
					success:function(res){
						if(res.done&&res.retval.order_id){
							location.reload();
//							$("#kong").css("display","none")
						}else{
//							$("#kong").css("display","none")
							
						}
						
					}
				});
			},
			qxpush:function(data){
				if(data){
					this.qxddshow=false;
				}
			},
			scrollajax:function(){
				if(this.scrollstatu){
					if(this.orderpage+1<=this.pagenum){
						var dSH=$(document).scrollTop()
						var dH=$(document).height()
						var wH=$(window).height()
						if((dSH+wH)/dH>0.8){
							this.scrollstatu=false;
							this.orderpage=this.orderpage+1;
							console.log(this.orderpage);
							this.ajaxorder();
						}
					}
					
				}
			}
		},
		mounted:function(){
			var self=this;
			window.addEventListener("scroll",self.scrollajax);
			this.user=localStorage.getItem("nt_user");
			$.ajax({
				type:"post",
				url:furl+"index.php?app=ajax_cart&act=index_cart",
				data:{'token':self.user},
				dataType:"json",
				success:function(res){
					if(res.done){
						self.shopcardxinxi=res.retval.carts;
//						$("#kong").css("display","block")
						
					}else{
//						$("#kong").css("display","none")
					
					}
					

				}
			});
		},
		destroyed:function () {
		    this.scrollstatu = false;
		}
		
	}
</script>

<style>
	#kong{
		text-align: center;
		margin: 0 auto;
		margin-top: 1.19rem;
	}
	#kong img{
		width: 3.6rem;
		height: 3.2rem;
	}
	#kong .kong-p{
		font-size: 0.32rem;
		color: #999999;
		margin-top: 0.84rem;
	}
	#kong .kong-b{
		width: 1.8rem;
		height: 0.7rem;
		border:1px solid #fb9722;
		margin-left:2.85rem;
		margin-top: 0.44rem;
		border-radius: 0.35rem;
	}
	#kong .kong-btn{
		font-size: 0.33rem;
		color: #fb9722;
		line-height: 0.7rem;
	}
</style>